<template>
  <div class="body"
       v-loading="realFlowLoading"
       :element-loading-text="otherI18n.Loading" >
    <bpm-d-navbar @submitVerify="submitVerify"
                  @confirmVerify="confirmVerify"
                  @rejectVerify="rejectVerify"
                  @rejectConfirmVerify="rejectConfirmVerify"
                  @reassignVerify="reassignVerify"/>
    <bpm-d-diagram v-show="diagramVisible"/>
    <bpm-d-history v-show="historyVisible"/>
    <!--业务实现-->
    <div v-show="mainVisible">
      <bpm-d-basearea :title="getLanguage('title.expenseReimburseProcess')" />
      <bpm-d-businessarea />
      <bpm-d-attachframe :allowCreate="true"
                         :allowUpdate="true"
                         :allowDelete="true"
                         :allowUpdateOthers="false"
                         :allowDeleteOthers="false"/>
    </div>
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex'
export default {
  name: 'page',
  data () {
    return {
      isDialogVisible: false,
      saberDialogWidth: '882px',
      flowLoading: false
    }
  },
  computed: {
    ...mapState(['hsInput', 'flowTypeEnum', 'pageTypeEnum', 'lang', 'langEnum', 'bpmcoreI18n', 'otherI18n']),
    ...mapState(['bizData', 'mainVisible', 'diagramVisible', 'historyVisible', 'lang', 'pageType', 'pageTypeEnum']),
    ...mapState(['inst', 'bpmcoreI18n', 'ssc', 'apiloading', 'view1stMounted']),
    ...mapState(['userId', 'tsId', 'dictFields', 'viewTableVisible']),
    realFlowLoading () {
      return this.flowLoading || (this.apiloading > 0)
    },
    costshareActtotalsum: {
      get () {
        return this.ssc.reimburse.whBtReimburse.costshareActtotalsum
      },
      set (value) {
        this.$store.commit('updateDataSscReimburseWhBtReimburse', { name: 'costshareActtotalsum', value: value })
      }
    },
    chailvRowGridInfo () {
      console.log('chailvrow payment grid item', this.$store.state.chailvRow.ssc.reimburse.whBtReimburseDdSub)
      return this.$store.state.chailvRow.ssc.reimburse.whBtReimburseDdSub
    },
    showChailvPart () {
      console.log('chailvRow22222222', this.chailvRowGridInfo)
      return (this.chailvRowGridInfo && this.chailvRowGridInfo.tsId)
    },
    whBtTravelSubsidyDetails: {
      get () {
        return this.ssc.reimburse.whBtTravelSubsidyDetails
      },
      set (value) {
        this.$store.commit('SetDataSscReimburseWhBtTravelSubsidyDetails', value)
      }
    },
    whBtTransportationDetails: {
      get () {
        return this.ssc.reimburse.whBtTransportationDetails
      },
      set (value) {
        this.$store.commit('SetDataSscReimburseWhBtTransportationDetails', value)
      }
    },
    whBtFareDetails: {
      get () {
        return this.ssc.reimburse.whBtFareDetails
      },
      set (value) {
        this.$store.commit('SetDataSscReimburseWhBtFareDetails', value)
      }
    },
    whBtStayDetails: {
      get () {
        return this.ssc.reimburse.whBtStayDetails
      },
      set (value) {
        this.$store.commit('SetDataSscReimburseWhBtStayDetails', value)
      }
    }
  },
  created () {
    this.setPageType(this.pageTypeEnum.approve)
  },
  mounted () {
    console.log('approval page mounted start', this.pageType)
    if (this.pageType !== this.pageTypeEnum.approve) { return }
    console.log('approval page view1st')
    // 通用加载服务
    this.loadResource({me: this})
    // if (this.view1stMounted) {
    //   return
    // }
    // this.setView1stMounted(true)
    console.log('whole view mounted........')
    this.$nextTick(function () {
      this.flowLoading = true
      setTimeout(() => {
        let paramJson = {}
        paramJson.me = this
        paramJson.tableNames = 'WH_BT_FAREDETAILS,WH_BT_STAYDETAILS,WH_BT_TRANSPORTATIONDETAILS,WH_BT_TRAVELSUBSIDYDETAILS,WH_BT_REIMBURSE_COSTSHARE,WH_BT_REIMBURSE_DD_SUB,WH_BT_REIMBURSE'
        paramJson.BB = 'Y'
        console.log('==========================approve=============================')
        this.getDataSscReimburseFromMoreTable(paramJson)
        console.log('all needed ajax asked here for approve………………………………………………')
        console.log('view state pageType:' + this.pageType)
        console.log('all needed ajax asked here^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^')
        this.flowLoading = false
      }, 100)
    })
  },
  methods: {
    ...mapActions(['loadResource', 'getAttachmentListLength', 'setBizData', 'setIsReassignVerify', 'setIsSubmitVerify', 'setIsConfirmVerify', 'setIsRejectVerify', 'setIsRejectConfirmVerify']),
    ...mapActions(['setPageType', 'setView1stMounted']),
    ...mapActions(['getDataSscReimburseWhBtReimburse', 'queryBBOptions']),
    ...mapActions(['getDataFromTableDdSub', 'AJAX_Reim_013_Count_SubChild', 'queryInternalOrder']),
    ...mapActions(['getDataFromTableFareDetails', 'getDataFromTableStayDetails', 'getDataFromTableTransportationDetails', 'getDataFromTableTravelSubsidyDetails']),
    ...mapActions(['getDataFromTableCostshare', 'getDataFromTableRcmDetails']),
    ...mapActions(['getDataSscReimburseFromMoreTable']),
    submitVerify () {
      this.setIsSubmitVerify(false)
      console.log('submitVerify start- >')
      // todo 业务校验
      let totalsum = this.$store.state.ssc.reimburse.whBtReimburse.totalsum // 合计金额
      if (totalsum == null || totalsum * 1 === 0) {
        this.alert(this.getResource('alert.information.jehjbnwk'))// "金额合计不能为空_,且不能为0!"
        return false
      }
      let obj = {}
      obj.totalsum = totalsum
      this.setBizData(JSON.stringify(obj)) // 根据实际业务传输金额
      console.log('submitVerify end- >')
      this.setIsSubmitVerify(true)
    },
    confirmVerify () {
      this.setIsConfirmVerify(false)
      console.log('confirmVerify 校验业务数据开始- >')
      // todo 业务校验
      console.log('confirmVerify 校验业务数据结束- >')
      this.setIsConfirmVerify(true)
    },
    rejectVerify () {
      this.setIsRejectVerify(false)
      console.log('rejectVerify 校验业务数据开始- >')
      // todo 业务校验
      console.log('rejectVerify 校验业务数据结束- >')
      this.setIsRejectVerify(true)
    },
    rejectConfirmVerify () {
      this.setIsRejectConfirmVerify(false)
      console.log('rejectConfirmVerify 校验业务数据开始- >')
      // todo 业务校验
      console.log('rejectConfirmVerify 校验业务数据结束- >')
      this.setIsRejectConfirmVerify(true)
    },
    reassignVerify () {
      this.setIsReassignVerify(false)
      console.log('reassignVerify 校验业务数据开始- >')
      // todo 业务校验
      console.log('reassignVerify 校验业务数据结束- >')
      this.setIsReassignVerify(true)
    },
    getAllGrandSubTable () {
      // 补贴 出租 交通 住宿
      if (!this.whBtFareDetails || this.whBtFareDetails.length <= 0) {
        this.getDataFromTableFareDetails({me: this, async: true})
      }
      if (!this.whBtStayDetails || this.whBtStayDetails.length <= 0) {
        this.getDataFromTableStayDetails({me: this, async: true})
      }
      if (!this.whBtTransportationDetails || this.whBtTransportationDetails.length <= 0) {
        this.getDataFromTableTransportationDetails({me: this, async: true})
      }
      if (!this.whBtTravelSubsidyDetails || this.whBtTravelSubsidyDetails.length <= 0) {
        this.getDataFromTableTravelSubsidyDetails({me: this, async: true})
      }
    }
  }
}
</script>

<style scoped>
.body {
  display: flex;
  flex-direction: column;
  font-size: 12px;
}
</style>
